<!DOCTYPE html>
<html>
	<head>
		<tal:block metal:use-macro="../macros.tpl.php/headScripts" />
		<script src="/js/report.js"></script>
	</head>
	<body>
		<div id='container'>
			<tal:block metal:use-macro="../macros.tpl.php/header_inner" />
			
			<h1><center>${title}</center></h1>

			<tal:block tal:condition="not: login">
				<center><span style="color:red;">Only login user can view this page. click <a href="/login/">here</a> to login</span></center>
			</tal:block>
			<tal:block tal:condition="login">
				<form method="post">
					<table align="center">
						<thead>
							<tr align="center"><th colspan="2">View Filtered Expense Report</th></tr>
						</thead>
						<tbody>
							<tr>
								<td>Team:</td>
								<td>
									<select name="tid">
										<option value="">Select</option>
										<option tal:repeat="team teams" tal:attributes="value team/id;selected team/selected">${team/name}</option>						
									</select>									
								</td>
							</tr>
							<tr style="display: ${membersShow};">
								<td>Members:</td>
								<td id="members">
									<tal:block tal:repeat="member members">
										<label>
											<input name="members[${member/id}]" type="checkbox" tal:attributes="value member/id;checked member/checked" />
											${member/text}
										</label><br />
									</tal:block>
								</td>
							</tr>
							<tr>
								<td>Date:</td>
								<td style="width: 230px;">
									<select name="m">
										<option value="">Month</option>
										<option tal:repeat="month months" tal:attributes="value month/value;selected month/selected">${month/text}</option>			
									</select>
									<select name="y">
										<option value="">Year</option>
										<option tal:repeat="year years" tal:attributes="value year/value;selected year/selected">${year/text}</option>			
									</select>								
								</td>
							</tr>
							<tr>
								<td></td>
								<td align="left"><button name="filterBtn" type="submit">Find</button></td>
							</tr>
						</tbody>
						<tfoot>
							<tr align="center">
								<td colspan="2" style="color:red;font-weight: bold;" id="formMsg"></td>
							</tr>
						</tfoot>
					</table>
				</form>

				<p></p>
				<table align="center" tal:condition="expenses">
					<thead>
						<tr>
							<th>Date</th>
							<th>Description</th>
							<th>Amount</th>
							<th>Spend By</th>
							<th>Team</th>
							<th>Group</th>
						</tr>
					</thead>
					<tbody>
						<tal:block tal:repeat="expense expenses">
						<tr tal:condition="not: repeat/expense/end">
							<td>${expense/date}</td>
							<td>${expense/desc}</td>
							<td>${expense/money}</td>
							<td>${expense/creator}</td>
							<td>${expense/team}</td>
							<td>${expense/group}</td>
						</tr>
						<tr tal:condition="repeat/expense/end">
							<td></td>
							<td><b>${expense/desc}</b></td>
							<td><b>${expense/money}</b></td>
							<td></td>
							<td></td>
							<td></td>
						</tr>
						</tal:block>
					</tbody>
					<tfoot tal:condition="paging">
						<tr>
							<td colspan="7">
								<div class="pagination">
									<tal:block tal:repeat="page paging">
										<a class="${page/class}" tal:attributes="href page/link">${page/number}</a>
									</tal:block>
								</div> <!-- eof paging -->
							</td>
						</tr>
					</tfoot>
				</table>
			</tal:block>

		    <tal:block metal:use-macro="../macros.tpl.php/footer" />
		</div>
	</body>
</html>
